<!--  -->
<template>
<!-- <div class=''> -->
  <div class="charge_box">
      <p class="charge_tit">{{title}}</p>
      <van-cell-group class="cell-group">
        <van-field v-model="charge_value" label="¥" clearable placeholder="最少充值1元" />
      </van-cell-group>
      <p class="other_money">可用余额：¥8.00</p>
    </div>
<!-- </div> -->
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';

export default {
//import引入的组件需要注入到对象中才能使用
components: {
  name:'chargeComp'
},
props:{
      title: String,
      required: true
},
data() {
//这里存放数据
return {
  charge_value: "",

};
},
//监听属性 类似于data概念
computed: {},
//监控data中的数据变化
watch: {},
//方法集合
methods: {

},
//生命周期 - 创建完成（可以访问当前this实例）
created() {

},
//生命周期 - 挂载完成（可以访问DOM元素）
mounted() {

},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
}
</script>
<style  scoped>
/* //@import url(); 引入公共css类 */
.charge_box {
  width: 100%;
  height: 132px;
  background: #fff;
  /* border-radius: 10px; */
  /* box-shadow: 0px 20px 20px 0px #fff2f0; */
  margin: auto;
  margin-top: 15px;
}
.charge_tit {
  font-size: 16px;
  font-weight: 400;
  color: #5f5f5f;
  line-height: 22px;
  padding: 10px 10px;
}
.other_money {
  font-size: 13px;
  font-weight: 400;
  color: #ff4a35;
  line-height: 18px;
  padding: 10px 10px;
}
.cell-group {
  width: 100%;
  height: 42px;
  /* background: #f7f7f7; */
  /* border-bottom: 1px solid #f7f7f7; */
  border-radius: 3px;
  /* margin: auto; */
}
.cell-group .van-cell {
   /* border-bottom: 1px solid #f7f7f7; */
  border-radius: 4px;
}

</style>